// 在权限拦截处调用action
import nProgress from 'nprogress'
import 'nprogress/nprogress.css'
import router, { asyncRoutes } from './router'
import store from './store'

const whiteList = ['/login', '/404']

// 前置守卫- 路由跳转之前会进入
router.beforeEach(async(to, from, next) => {
  // to 到哪里去
  // from 从哪里来
  // next-必须执行的函数-不执行页面就会卡住 pending fullfiled rejected
  // next() 放过通行 login => dashboard => 顺利通行
  // next(false) 终止跳转 => login => dashboard => 留在login
  // next(地址) 转发地址 next("/test") login => dashboard => 跳到test
  // 不论什么场景下 next必须执行 否则就会页面空白
  nProgress.start() // 开启进度条
  if (store.getters.token) {
    // 此时已经登录过了
    if (to.path === '/login') {
      next('/') // 在有token的情况下 登录过 访问的是登录页那直接去主页
      nProgress.done() // next中转地址的情况下 不会走后置守卫  关闭进度条
    } else {
      // 这里获取用户资料 不是每次都获取
      // 当前没有用户资料的时候获取 => Vuex(全局) => 有没有用户资料
      if (!store.getters.userId) {
        // 获取用户资料
        const { roles } = await store.dispatch('user/getUserInfo')
        console.log(roles.menus)
        console.log(asyncRoutes)
        // 筛选后的路由
        const newRoutes = asyncRoutes.filter(item => {
          return roles.menus.includes(item.name)
          // console.log(item.name)
        })
        // 筛选后的路由
        store.commit('user/setRoutes', newRoutes)
        // 添加到路由上
        router.addRoutes([...newRoutes, { path: '*', redirect: '/404', hidden: true }])
        // 异步操作，需要添加完路由之后，在中转一下
        next(to.path)
        // 关闭进度条
        nProgress.done()
      } else {
        next()
      }
    }
  } else {
    // 白名单的含义 - 有的页面不登录也可以看 比如 404 比如登录页
    if (whiteList.includes(to.path)) {
      next()
    } else {
      next('/login') // 跳转到登录页
      nProgress.done() // 关闭进度条
    }
  }
})

// 后置守卫-路由跳转完成进入
router.afterEach(() => {
  console.log(123)
  nProgress.done() // 关闭进度条
})
